<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/personal.css">
</head>
<style>
    table {
        width: 86.049107%;
        margin: 23px auto 0;
        font: 13px/35px "simhei";
        text-align: center;
        vertical-align: middle;
    }
    table th{
        background-color: #dbf2fb;
    }
    .td_1 {
        width: 10.246433%;
    }

    .td_2 {
        width: 13.488975%;
    }

    .td_3 {
        width: 14.137483%;
    }

    .td_4 {
        width: 17.175097%;
    }

    .td_5 {
        width: 13.116731%;
    }

    .td_6 {
        text-align: left;
        text-indent: 30px;
    }
</style>

<body>
    <div class="content">
        <div class="content_header">
            <strong>我的预约</strong>
        </div>
        <table>
            <tr>
                <th class="td_1">姓名</td>
                <th class="td_2">性别</td>
                <th class="td_3">预约时间</td>
                <th class="td_4">医院</td>
                <th class="td_5">类型</td>
                <th class="td_6">患者病情</td>
            </tr>
            <tr class="myOrder">
                <td class="td_1">Tony</td>
                <td class="td_2">女</td>
                <td class="td_3">12-9</td>
                <td class="td_4">省人民医院</td>
                <td class="td_5">检查/治疗</td>
                <td class="td_6">感冒发烧</td>
            </tr>
        </table>
    </div>
</body>
<script src="../js/json.js"></script>
<script>
    var oTable = document.getElementsByTagName("table")[0];
    var oMyOrder = document.getElementsByClassName("myOrder");
    for(var i=0;i<oMyOrder.length;i++){
        oMyOrder[i].remove();
        i--;
    }
    for(var i=0;i<order.length;i++){
        var oTr = document.createElement("tr");
        oTable.appendChild(oTr);
        for(var j=0;j<6;j++){
            var oTd = document.createElement("td");
            oTd.className = "td_"+ (j+1);
            oTr.appendChild(oTd);
            oTr.className = "myOrder";
        }
        var orderoTd = oTr.getElementsByTagName("td");
        orderoTd[0].innerHTML = order[i].name;
        orderoTd[1].innerHTML = order[i].sex;
        orderoTd[2].innerHTML = order[i].ordertime;
        orderoTd[3].innerHTML = order[i].host;
        orderoTd[4].innerHTML = order[i].type;
        orderoTd[5].innerHTML = order[i].state;
    }
    if( localStorage.getItem("appointmentRoom") ){
        var oTr = document.createElement("tr");
        oTable.appendChild(oTr);
        oTr.className = "myOrder";
        for(var j=0;j<6;j++){
            var oTd = document.createElement("td");
            oTd.className = "td_"+ (j+1);
            oTr.appendChild(oTd);
            oTr.className = "myOrder";
        }
        var orderoTd = oTr.getElementsByTagName("td");
        orderoTd[0].innerHTML = localStorage.getItem('appointmentName') || "无";
        orderoTd[1].innerHTML = localStorage.getItem('appointmentSex') || "无";
        orderoTd[2].innerHTML = localStorage.getItem('appointmentMonth') + "-" + localStorage.getItem('appointmentDay') || "无";
        orderoTd[3].innerHTML = "郑大医附院" || "无";
        orderoTd[4].innerHTML = localStorage.getItem('appointmentType') || "无";
        orderoTd[5].innerHTML = localStorage.getItem('appointmentState') || "无";
    }
</script>
</html>